import Vue from 'vue';
import Axios from 'axios';
import Qs from 'qs';
import Datepicker from 'vuejs-datepicker';
import {zh} from 'vuejs-datepicker/dist/locale';
import VModal from 'vue-js-modal';
import '../basic/basic.css';
import '../theme/fonts/iconfont.css';
import './css/edit.css';
import Map from "../components/map/map";

Vue.use(VModal,{dialog:true});
new Vue({
    el:'#louie',
    data:{
        //--公共--
        url:$('#louie').attr('data-url'),
        doing:'add',
        activity_id:0,  //活动id
        //S数据
        status:0,  //活动状态
        phases_status:0,  //活动进行阶段状态
        address:'',  //活动地址
        shop_model:0,  //是否开启商场模式
        date:{
            zh:zh
        },
        times:[],   //24小时时间选择器
        start_date:new Date(),  //活动开始日期
        end_date:new Date(),   //活动结束日期
        start_time:'12:00',  //开始时间
        end_time:'12:00',  //结束时间
        m_coords:[],  //地图组件选中的区域
        map_coords:[],  //选择的活动区域数据
        min_area:1000,   //选取区域最小平方米
    },
    components:{
        'date-picker':Datepicker,
        'louie-map':Map
    },
    created:function(){
        this.checkActivity();
        this.createTimes();
        if(this.doing == 'edit') this.find();
    },
    computed:{
        //活动开始时间
        start:function(){
            return this.startEnd(this.start_date,this.start_time);
        },
        //活动结束时间
        end:function(){
            return this.startEnd(this.end_date,this.end_time);
        },
    },
    methods:{
        //获取活动数据
        find(){
            Axios.post(this.url,Qs.stringify({
                pages:'activity',
                doing:'find',
                activity_id:this.activity_id
            }))
                .then((res)=>{
                    if(res.data.status == 'error'){
                        this.alert('活动不存在',function(){
                            window.location.href = $('#louie-edit').attr('data-prev-page');
                            return false;
                        });
                    }
                    var data = res.data.data;
                    this.start_date = new Date(data.start_date);
                    this.start_time = data.start_time;
                    this.end_date = new Date(data.end_date);
                    this.end_time = data.end_time;
                    this.map_coords = data.map_coords;
                    this.m_coords = data.map_coords;
                    this.address = data.address;
                    this.shop_model = data.shop_model;
                    this.status = data.status;
                    this.phases_status = data.phases_status;
                })
                .catch(error=>console.log(error));
        },
        //提交修改活动
        submit(){
            if(!this.checkSubmit()) return;
            var data = {
                address:this.address,
                map_coords:JSON.stringify(this.map_coords),
                start:this.start,
                end:this.end,
                shop_model:this.shop_model
            }
            var send_data = {
                pages:'activity',
                doing:this.doing,
                data
            }
            if(this.doing == 'edit'){
                send_data.activity_id = this.activity_id;
            }
            Axios.post(this.url,Qs.stringify(send_data))
                .then((res)=>{
                    if(res.data.status == 'success'){
                        this.alert(this.doing == 'add' ? '创建成功' : '修改成功',()=>{
                            if(this.doing == 'add'){
                                this.activity_id = res.data.data;
                                this.doing = 'edit';
                                window.location.href = sysinfo.siteurl+'#doing=edit#activity_id='+this.activity_id;
                            }
                        });
                    }else{
                        this.alert(this.doing == 'add' ? '创建失败' : '修改失败');
                    }
                })
                .catch(error=>console.log(error));
        },
        //验证提交数据
        checkSubmit(){
            var nowTime = new Date().getTime()/1000;
            if(nowTime >= this.start && this.doing == 'add'){
                this.alert('活动开始时间不能小于当前时间');
                return false;
            }
            if(this.start >= this.end){
                this.alert('活动结束时间必须大于开始时间');
                return false;
            }
            if(this.address == ''){
                this.alert('请输入活动地址');
                return false;
            }
            if(this.map_coords.length <= 0){
                this.alert('请先选择活动区域');
                return false;
            }
            return true;
        },
        //选择地图点击确认，返回所选区域坐标等内容
        returnCoords(event){
            this.map_coords = event;
        },
        //生成时间
        createTimes:function(){
            for(var i=0;i<=23;i++){
                var h = i;
                if(h < 10){
                    h='0'+h;
                }
                for(var j=0;j<60;j++){
                    var m = j;
                    if(m<10){
                        m='0'+m;
                    }
                    this.times.push(h+':'+m);
                }
            }
        },
        //计算开始结束时间戳
        startEnd:function(date,time){
            var year = date.getFullYear();
            var month = date.getMonth()+1;
            var day = date.getDate();
            return new Date(year+'/'+month+'/'+day+' '+time).getTime()/1000;
        },
        //alert
        alert:function(text,call){
            var self = this;
            this.$modal.show('dialog',{
                text:text,
                buttons:[
                    {
                        title:'关闭',
                        handler:function(){
                            self.$modal.hide('dialog');
                            typeof call =='function' && call();
                        }
                    },
                ]
            });
        },
        //编辑验证活动
        checkActivity:function(){
            var hash = this.hash();
            if(hash.doing == 'edit'){
                this.doing = 'edit';
                if(hash.activity_id == undefined){
                    window.location.href = $('#louie-edit').attr('data-prev-page');
                    return false;
                }
                this.activity_id = hash.activity_id;
            }
        },
        //解析链接hash
        hash:function(){
            var hash = window.location.hash;
            hash = hash.substring(1);
            if(hash == '') return {};
            var tempArr = hash.split('#');
            var data = {};
            for(var i=0;i<tempArr.length;i++){
                var tArr = tempArr[i].split('=');
                data[tArr[0]] = tArr[1];
            }
            return data;
        }
    }
});